import util from '@/libs/util';
import Cookies from 'js-cookie';
import getDate from '@/util/getDate.js';
import CONSTANTS from '@/config/constants';

export default {
    name: 'exportable-table',
    data () {
        return {
            columns: [{
                title: '序号',
                key: 'rownum',
                align: 'center',
                width: 60,
                render: (h, params) => {
                    return h('div', {}, ((this.pageIndex - 1) * this.pageSize + params.index + 1));
                }
            }, {
                title: '模板名称',
                key: 'name',
                render: (h, params) => {
                    return h('a', {
                        on: {
                            click: () => {
                                this.formData.imgPath = CONSTANTS.SERVER_HOST + params.row.path;
                                this.viewModal = true;
                            }
                        }
                    }, params.row.name);
                }
            }, {
                title: '所属机构',
                key: 'orgId',
                render: (h, params) => {
                    return h('div', {}, (params.row.organize ? params.row.organize.orgName : ''));
                }
            }, {
                title: '创建时间',
                key: 'createtime',
                render: (h, params) => {
                    return h('div', {}, getDate.getDate(params.row.createtime, 'time'));
                }
            }, {
                title: '操作',
                key: 'action',
                width: 260,
                align: 'center',
                render: (h, params) => {
                    return h('div', [
                        h('Button', {
                            props: {
                                type: 'primary',
                                size: 'small'
                            },
                            style: {
                                marginRight: '5px',
                                display: params.row.type === 1 ? (this.baseuser.type === 2 ? 'none' : 'inline') : 'inline'
                            },
                            on: {
                                click: () => {
                                    this.showEdit(params.row);
                                }
                            }
                        }, '修改'),
                        h('Button', {
                            props: {
                                type: 'error',
                                size: 'small'
                            },
                            style: {
                                marginRight: '5px',
                                display: params.row.type === 1 ? (this.baseuser.type === 2 ? 'none' : 'inline') : 'inline'
                            },
                            on: {
                                click: () => {
                                    this.delete(params.row.id);
                                }
                            }
                        }, '删除'),
                        h('Button', {
                            props: {
                                type: 'primary',
                                size: 'small'
                            },
                            style: {
                                marginRight: '5px'
                            },
                            on: {
                                click: () => {
                                    this.copy(params.row.id);
                                }
                            }
                        }, '复制')
                    ]);
                }
            }],
            baseuser: JSON.parse(Cookies.get('baseUser')),
            data: [],
            formData: {
                id: '',
                name: '',
                content: {
                    backgroundUrl: '',
                    sprites: []
                }
            },
            viewModal: false,
            editModal: false,
            total: 0,
            pageIndex: 1,
            pageSize: 10,
            queryCon: {
                name: ''
            },
            makeTemplate: [],
            imgScale: 1,
            $previewContainer: null,
            copyModal: false,
            copyForm: {}
        };
    },
    mounted () {
        this.loadList();
    },
    methods: {
        loadList () {
            util.ajax.post('/busine/model/list', util.toFormData({
                page: this.pageIndex,
                size: this.pageSize,
                name: this.queryCon.name,
                organizeid: (this.baseuser.type === 2 ? this.baseuser.orgId : '')
            })).then(res => {
                this.data = res.data.data.list;
                this.total = res.data.data.total;
            });
        },
        showEdit (obj) {
            for (let key in obj) {
                this.formData[key] = obj[key];
            }
            let content = this.formData.content;
            try {
                var jsonObj = JSON.parse(content);
                if (typeof jsonObj === 'object' && jsonObj) {
                    this.formData.content = jsonObj;
                } else {
                    this.formData.content = {
                        backgroundUrl: '',
                        sprites: []
                    };
                }
            } catch (e) {
                this.formData = {
                    id: '',
                    name: '',
                    content: {
                        backgroundUrl: '',
                        sprites: []
                    }
                };
            }
            this.$router.push({
                path: 'prizemodelmake',
                name: 'prizemodelmake',
                params:  this.formData
            });
        },
        delete (id) {
            this.$Modal.confirm({
                title: '提示',
                content: '<p>确定删除？</p>',
                onOk: () => {
                    util.ajax.post('/busine/model/delete', util.toFormData({
                        id: id
                    })).then(res => {
                        if (res.data.message === 'SUCCESS') {
                            this.$Message.success('删除成功！');
                            this.loadList();
                        }
                    });
                },
                onCancel: () => {
                }
            });
        },
        getSpriteStyle (sprite) {
            let style = {
                transform: `translateX(${sprite.x * this.imgScale}px) translateY(${sprite.y * this.imgScale}px)`
            };
            if (sprite.type === 'picture') {
                style.width = `${sprite.width * this.imgScale}px`;
                style.height = `${sprite.height * this.imgScale}px`;
            }
            return style;
        },
        copy (id) {
            this.copyForm.name = '';
            this.copyForm.id = id;
            this.copyForm.orgId = this.baseuser.orgId;
            this.copyModal = true;
        },
        copySave () {
            let formData = this.copyForm;
            if (!formData.name) {
                this.$Modal.error({
                    content: '请输入模板名称！'
                });
                return false;
            }
            util.ajax.post('/busine/model/copy', util.toFormData(formData)).then(res => {
                if (res.data.message === 'SUCCESS') {
                    this.$Modal.success({content: '复制成功！'});
                    this.loadList();
                    this.copyModal = false;
                }
            });
        }
    }
};